var loadedImages = new Array();
var zooms = [0.0625, 0.125, 0.25, 0.5, 0.75, 1.0, 1.5, 2.0, 3.0, 4.0, 5.0];
var defaultZoomIndex = 5;
var zoomIndex = defaultZoomIndex;
var ie = navigator.appName.indexOf("Microsoft") > -1;

var viewport, image, videos,
	imgIndex = 0, moveDelta,
	screenHeight, screenWidth, imageHeight, imageWidth;

function $(e) { return document.getElementById(e); }

function indexOf(array, item)
{
	var i;
	for (i=0; i<array.length; i++)
		if (array[i] == item) break;
	if (i == array.length) i = -1;
	//$("debug").innerHTML += i + " ";
	return i;
}

function Init()
{

	if (ie)
	{
		window.resizeTo(220, 176);
		var x=176, y=220;
		while (document.body.clientHeight < 220) window.resizeTo(x, ++y);
		while (document.body.clientWidth < 176) window.resizeTo(++x, y);
		//document.body.clientHeight = 220;
		//document.body.clientWidth = 176;
	}

	screenHeight = parseInt(ie ? document.body.clientHeight : window.innerHeight);
	screenWidth = parseInt(ie ? document.body.clientWidth : window.innerWidth);
	moveDelta = (screenHeight + screenWidth) / 10;

	viewport = $("viewport");
	viewport.style.display = "block";
	viewport.style.height = screenHeight + "px";
	viewport.style.width = screenWidth + "px";

	image = $("image");

	imgIndex = GetQSIndex();
	if (imgIndex == -1)
		imgIndex = 0;
	GotoImage(imgIndex);
}

/*function OnKeyDown()
{
	$("debug").innerHTML += "KD:" + window.event.srcElement.tagName + ":" + window.event.keyCode + "<br>";
}*/

function OnKeyPress(e)
{
	if (!e) e = window.event;
	//$("debug").innerHTML += "KP:" + window.event.srcElement.tagName + ":" + window.event.keyCode + "<br>";
	//alert(e.keyCode);
	switch (e.keyCode)
	{
		case DOM_VK_0:
		case DOM_VK_NUMPAD0:
			GotoImage(Math.floor(Math.random() * (images.length + 1)));
			break;

		case DOM_VK_1:
		case DOM_VK_NUMPAD1:
			AdvanceBy(-1);
			break;

		case DOM_VK_2:
		case DOM_VK_NUMPAD2:
			if (image.height > screenHeight)
				image.style.top = Math.min((parseInt(image.style.top) + moveDelta), 0) + "px";
			break;

		case DOM_VK_3:
		case DOM_VK_NUMPAD3:
			AdvanceBy(1);
			break;

		case DOM_VK_4:
		case DOM_VK_NUMPAD4:
			if (image.width > screenWidth)
				image.style.left = Math.min((parseInt(image.style.left) + moveDelta), 0) + "px";
			break;

		case DOM_VK_5:
		case DOM_VK_NUMPAD5:
			ShowPopup();
			break;

		case DOM_VK_6:
		case DOM_VK_NUMPAD6:
			if (image.width > screenWidth)
				image.style.left = Math.max((parseInt(image.style.left) - moveDelta), screenWidth - image.width) + "px";
			break;

		case DOM_VK_7:
		case DOM_VK_NUMPAD7:
			AdvanceBy(-10);
			break;

		case DOM_VK_8:
		case DOM_VK_NUMPAD8:
			if (image.height > screenHeight)
				image.style.top = Math.max((parseInt(image.style.top) - moveDelta), screenHeight - image.height) + "px";
			break;

		case DOM_VK_9:
		case DOM_VK_NUMPAD9:
			AdvanceBy(10);
			break;

		//case 72:	// #
		case 35:	// #
			Zoom(1);
			break;

		//case 83:	// *
		case 42:	// *
			Zoom(-1);
			break;
	}
}

function AdvanceBy(delta)
{
	imgIndex += delta;
	if (imgIndex < 0) imgIndex = 0;
	if (imgIndex >= images.length) imgIndex = images.length - 1;
	GotoImage(imgIndex);
	if (delta > 0)
		$("preload").src = "/i/" + images[imgIndex + 1];
	else
		$("preload").src = "/i/" + images[imgIndex - 1];
}

function GotoImage(index)
{
	imgIndex = index;
	zoomIndex = defaultZoomIndex;
	LoadImage(index, zooms[zoomIndex]);
	//shutter.style.display = "block";
	if (indexOf(loadedImages, imgIndex) > -1)
		ImageLoaded();
}

function LoadImage(index, zoom)
{
	if (zoom == zooms[defaultZoomIndex])
	{
		//image.style.width = "";
		image.style.left = image.style.top = "0";
	}
	image.src = "";
	image.src = "/i/" + images[imgIndex] + "?z=" + zoom;
}

function ShowPopup()
{
	RefreshImgInfo();
	$("popup").style.display = ($("popup").style.display == "none") ? "block" : "none";
}

function RefreshImgInfo()
{
	$("imgInfo").innerHTML = /*images[imgIndex] +*/ " (" + (imgIndex + 1) + "/" + images.length + ")<br>" +
		image.width + "x" + image.height + "<br>" +
		imageWidth + "x" + imageHeight;
}

function Zoom(delta)
{
	zoomIndex += delta;
	if (zoomIndex < 0) zoomIndex = 0;
	if (zoomIndex >= zooms.length) zoomIndex = zooms.length - 1;

	image.style.left = parseInt(image.style.left) + (image.width - image.width * zooms[zoomIndex] / zooms[zoomIndex - delta]) / 2 + "px";
	image.style.top = parseInt(image.style.top) + (image.height - image.height * zooms[zoomIndex] / zooms[zoomIndex - delta]) / 2 + "px";

	$("debug").innerHTML = "[" + image.style.left + "," + image.style.top + "]";

	LoadImage(imgIndex, zooms[zoomIndex]);
	//CenterImage();
}

function ImageOnLoad()
{
	if (indexOf(loadedImages, imgIndex) == -1)
		loadedImages.push(imgIndex);
	ImageLoaded();
}

function ImageLoaded()
{
	imageHeight = image.height;
	imageWidth = image.width;
	//image.style.width = imageWidth + "px";
	/*if (image.width < screenWidth) image.style.left = (screenWidth/2 - image.width/2) + "px";
	if (image.height < screenHeight) image.style.top = (screenHeight/2 - image.height/2) + "px";*/
	//shutter.style.display = "none";
	if ($("popup").style.display == "block") RefreshImgInfo();
}

function CenterImage()
{
	if (image.width == 0 || image.height == 0)
	{
		//$("debug").innerHTML += "centre...<br>";
		window.setTimeOut("CenterImage()", 200);
	}
	else
	{
		image.style.left = (screenWidth/2 - image.width/2) + "px";
		image.style.top = (screenHeight/2 - image.height/2) + "px";
		$("debug").innerHTML = "width:" + image.width + " height:" + image.height;
	}
}

function NavtoImage()
{
	window.location = image.src;
}

function GetQSIndex()
{
	var s = window.location.href;
	var i = s.lastIndexOf("#");
	if (i == -1)
		return -1;
	return parseInt(s.substr(i+1));
}

function ReloadPage()
{
	var s = window.location.href;
	var i = s.lastIndexOf("#");
	if (i != -1)
		s = s.substr(0, i);
	window.location = s + "#" + imgIndex;
}
